import Vue from 'vue'
import Vuex from 'vuex'
// 引入接口
import { loginAPI } from '@/api'
Vue.use(Vuex)

export default new Vuex.Store({
  // 存储数据
  state: {
    token: localStorage.getItem('token') || '',
    refresh_token: localStorage.getItem('refresh_token') || '',
    user: JSON.parse(localStorage.getItem('user')) || {}
  },
  // 修改数据
  mutations: {
    // 修改state中的token
    setToken (state, token) {
      state.token = token
      // 将数据存入本地
      localStorage.setItem('token', token)
    },
    // 修改state中的 refresh_token
    setRefreshToken (state, refresh_token) {
      state.refresh_token = refresh_token
      localStorage.setItem('refresh_token', refresh_token)
    },
    // 修改state中的 user
    setUser (state, user) {
      state.user = user
      localStorage.setItem('user', JSON.stringify(user))
    }
  },
  // 异步操作，axios请求
  actions: {
    // vuex实现登录并保存token变量
    // 1.在vueX中的state中定义变量
    // 2.在mutations中定义修改state数据的方法
    // 3.需要在vuex中引入接口
    // 4.在actions中实现接口的调用，同时调用vuex中的mutations方法，
    // 实现将接口垫返回值存放在vuex中的state中
    // 5.在需要调用登录接口的文件中通过mapActions
    // 或者this.$store.dispatch('asyncLoginAction','传入接口所需要的参数')
    async LoginAction (store, val) {
      try {
        const res = await loginAPI(val)
        const { refresh_token, token } = res.data.data
        store.commit('setToken', token)
        store.commit('setRefreshToken', refresh_token)
        return Promise.resolve(res) // 返回成功的Promise对象
      } catch (error) {
        return Promise.reject(error) // 返回失败的Promise对象
      }
    }
  },
  // 模块
  modules: {
  }
})
